<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<style type="text/css">
* {
	margin: 0;
	padding: 0;
}

body {
	font-size: 13px;
	line-height: 130%;
	padding: 60px;
}

#content {
	width: 220px;
	border: 1px solid #0050D0;
	background: #96E555;
}

span {
	width: 200px;
	margin: 10px;
	background: #666666;
	cursor: pointer;
	color: white;
	display: block;
}

p {
	width: 200px;
	background: #888;
	color: white;
	height: 16px;
}
</style>
<script type="text/javascript" src="../scripts/jquery-1.7.2.js"></script>
<!-- <script type="text/javascript">
		
			$(function(){
				//事件的冒泡: 什么是事件的冒泡
				$("body").click(function(){
					alert("body click");
				});
				
				$("#content").click(function(){
					alert("div click");
				});
				
				$("span").click(function(){
					alert("span click");
					//如何解决事件的冒泡: 通过在响应函数的结尾返回 false, 可以阻止冒泡. 
					return false;
				});
			})
		
		</script> -->
<script type="text/javascript">
	//对冒泡事件的处理
	$(function() {
		$("body").click(function() {
			alert("body click...");
			return false;
		});

		$("div").click(function() {
			alert("div click...");
			return false;
		});
		$("span").click(function() {
			alert("span click...");
			return false;
		});

		$("a").click(function() {
			alert("a click...");
			return false;
		});
	})
</script>
</head>
<body>
	<div id="content">
		外层div元素 <span>内层span元素</span> 外层div元素
	</div>

	<div id="msg"></div>

	<br>
	<br>
	<a href="http://www.hao123.com">WWW.HAO123.COM</a>
</body>
</html>

